import React, { lazy, LazyExoticComponent } from "react"
import { RouteObject, Navigate } from "react-router-dom"

const lazyElement = (path: string, ifRedirect = false): JSX.Element => {
  if (ifRedirect) {
    return <Navigate to={path} />
  }
  const Element = lazy(() => import(`@/views/${path}`))
  return <Element />
}

type RecursiveRouteObjectCustom = Omit<RouteObject, "children"> & {
  title: string
  children?: RecursiveRouteObjectCustom[]
}

const routers: Array<RouteObject> = [
  {
    path: "/",
    element: lazyElement("home", true)
  },
  {
    path: "/home",
    element: lazyElement("home"),
    children: [
      {
        path: "/home/recommand",
        element: lazyElement("home/c-views/recommand")
      }
    ]
  },
  {
    path: "/mine",
    element: lazyElement("mine")
  }
]

export default routers
